import React from "react";
import {Button, Upload, Table, Modal, Form, Icon, notification, InputNumber, message, Input} from "antd";
import ViewTitle from "../../../components/ViewTitle";
import notify from "../../../components/NotificationExtra";
import {connect} from "dva";
import ComponentBase from "../../../components/Base/ComponentBase";
import {FormField, FormLayout, ModalFooter} from "antd-extra";
import TextArea from "antd/es/input/TextArea";
import {getCode} from "../../../services/global";

@Form.create()
@connect(({global, user, dict}) => ({...global, ...user, ...dict}))
export default class ModalFileDetail extends ComponentBase {
  constructor(props) {
    super(props);
    this.state = {};
  }

  renderFoot = () => {
    const {foot, value, modalRef, callback, form} = this.props;
    if (foot) {
      return foot(value, modalRef);
    } else {
      return (
        <ModalFooter>

          <Button onClick={() => {
            modalRef.close();
          }}>取消</Button>
        </ModalFooter>
      );
    }
  };

  render() {
    const {record={},form} = this.props;
    const {fileList = [],filename, memo} = record;

    return (
      <Form>
        {

            <FormLayout form={form} cols={1}>
              <FormField
                label={"文件"}
                name={'file'}

              >
                <Upload
                  name={'file'}
                  //   action={`http://127.0.0.1:18008/api/global/upload?orderCode=${code}&table=SalesOrder&tenantCode=${tenantCode}&fileList=${[...fileList]}`}
                  headers={{authorization: 'authorization-text'}}
                  listType={"picture-card"}
                  accept={".pdf,.doc,.docx,.xls,.xlsx"}
                  fileList={fileList}
                  showUploadList={true}
                  // previewFile={file=>{
                  //   console.log(file);
                  // }}
                  onDownload={info => {
                    console.log('ondownlad', info);
                  }}
                  onPreview={file => window.open(file.url)}
                  onChange={(info) => {
                    let {fileList} = info;
                    // fileList = fileList.filter(file => file.type === 'application/pdf');
                    fileList = fileList.map(file => {
                      console.log('ffff', file);
                      if (file.response) {
                        file.url = file.response.result.url; // 假设服务端返回了文件url
                      }
                      return file;
                    });
                    const temp = this.state;
                    temp.fileList = fileList;
                    this.setState({...temp});

                  }}
                  // 限制文件类型为PDF
                  beforeUpload={file => {

                  }}
                >
                  {fileList.length === 0 && <div>
                    <Icon type="plus"/>
                    <div className="ant-upload-text">上传文件</div>
                  </div>}
                </Upload>
              </FormField>
              <FormField
                label={"文件名"}
                name={'filename'}
                initialValue={filename}
              >
                <Input disabled
                ></Input>
              </FormField>
              <FormField
                label={"备注"}
                name={'memo'}
                initialValue={memo}
              >
                <TextArea disabled
                ></TextArea>
              </FormField>
            </FormLayout>

        }
        {this.renderFoot()}
      </Form>
    );
  }
}



